
<script type="text/javascript" src="/content/js/pages/comment.js"></script>

{literal}
<style type="text/css">
	textarea{
		font-family: "ＭＳ ゴシック", "ＭＳ 明朝";
	}
	
	#result_line{
		background-color: #FFFFFF;
	}
	
	#result_chat{
		resize:none;
		overflow:hidden;
		border:solid 1px #555555;
		background-color: #555555;
		color:#FFFFFF;
	}
	
	#result_balloon{
		resize:none;
		overflow:hidden;
		background-color: #FFFFFF;
		border:solid 1px #555555;
	}
	
	#div_faq{
		display: none;
		background-color: #FFFFFF;
		border: 1px solid #888888;
		color: #333333;
		right: 0;
		margin: 59px 15px;
		padding: 8px;
		position: absolute;
		top: 0;
	}
	
	.btn {
		background: -moz-linear-gradient(top,#BFE5D9, #3DB795 50%,#00B380 50%,#00CC99);
		background: -webkit-gradient(linear, left top, left bottom, from(#BFE5D9), color-stop(0.5,#3DB795), color-stop(0.5,#00B380), to(#00CC99));
		color: #FFF;
		border-radius: 4px;
		-moz-border-radius: 4px;
		-webkit-border-radius: 4px;
		border: 1px solid #0099CC;
		-moz-box-shadow: 1px 1px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0.5);
		-webkit-box-shadow: 1px 1px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0.5);
		text-shadow: 0px 0px 3px rgba(0,0,0,0.5);
		width: 110px;
		padding: 1px 1px;
		margin-bottom:3px;
	}
	
</style>
{/literal}

{assign var="title" value="コメント・マクロ生成ツール"}

<h2>{$title|escape}</h2>

<div class="tr">
	<input type="button" class="btn" id="button_faq_show" value="使い方・更新履歴" />
</div>

<ul id="ul_error_msg" class="err_msg" style="display:none;"><li>&nbsp;</li></ul>
<ul id="ul_standard_msg" class="std_msg" style="display:none;"><li>&nbsp;</li></ul>

<form method="get" action="?">
	<div class="outer_frame cb">
		<h3>入力欄</h3>
		<table class="search double_column">
			<tr>
				<th style="width:30%;">キャラクター名入力</th>
				<td colspan="3">
					<input type="text" id="name" value="" />
				</td>
			</tr>
			{*
			<tr>
				<th style="width:30%;">
					作成タイプ(未実装)<br />
					※必要あるか検討中
				</th>
				<td colspan="3">
					<input type="radio" class="type" value="1" checked="checked" />バルーンのみ最適化<br />
					<input type="radio" class="type" value="2" />チャット欄含めて最適化
				</td>
			</tr>
			*}
			<tr>
				<th style="width:30%;">範囲指定</th>
				<td colspan="3">
					<input type="radio" name="range" class="range" value="" checked="checked" />なし<br />
					<input type="radio" name="range" class="range" value="p" />PT<br />
					<input type="radio" name="range" class="range" value="f" />部隊<br />
					<input type="radio" name="range" class="range" value="a" />軍団<br />
					<input type="radio" name="range" class="range" value="as" />軍範<br />
					<input type="radio" name="range" class="range" value="s" />範囲<br />
					<input type="radio" name="range" class="range" value="dc no" />デッドコメント<br />
				</td>
			</tr>

			<tr class="nobd">
				<th style="width:30%;">
					表示したいコメント
					<ul id="length_err" class="err_msg" style="display:none;"><li>&nbsp;</li></ul>
				</th>
				<td colspan="3">
					<textarea rows="5" cols="50" id="comment"></textarea>
				</td>
			</tr>

			{*
			<tr class="nobd">
				<th style="width:30%;">&nbsp;</th>
				<td colspan="3">
					<input type="button" id="debug" value="デバッグ" />
				</td>
			</tr>
			*}
		</table>

		<br />

		<h3>予想結果</h3>

		<table class="search double_column">
			<tr>
				<th style="width:30%;">行テキスト</th>
				<td colspan="3">
					<input type="text" readonly="readonly" id="result_line" size="100" />
				</td>
			</tr>

			<tr>
				<th style="width:30%;">チャット欄</th>
				<td colspan="3">
					<textarea  rows="1" cols="53" id="result_chat" readonly="readonly"></textarea>
				</td>
			</tr>

			<tr class="nobd">
				<th style="width:30%;">バルーン(半角40文字で強制改行)</th>
				<td colspan="3">
					<textarea  rows="1" cols="43" id="result_balloon" readonly="readonly"></textarea>
				</td>
			</tr>
		</table>

	</div>
	
	{* 使い方、更新履歴 *}
	<div id="div_faq">
		<div class="tr">
			<input type="button" class="btn" id="button_faq_hide" value="閉じる" />
		</div>
	
		<div class="outer_frame cb">
			
			<h3>ツール情報</h3>
			<table class="double_column">
				<tr>
					<th style="width: 30%;">動作環境</th>
					<td colspan="3">
						javascriptが正常動作するブラウザ
					</td>
				</tr>
				
				<tr>
					<th>確認済みブラウザ</th>
					<td colspan="3">
						InternetExplorer8<br />
						InternetExplorer9<br />
						FireFox3.6<br />
						GoogleChorme<br />
						Safari<br />
						Opera
					</td>
				</tr>
				
				<tr class="nobd">
					<th>使い方</th>
					<td colspan="3">
						<ul class="std_msg">
							<li>キャラクター名を入力してください。</li>
							<li>正しいキャラクター名を入力し、フォーカスを外すと範囲指定と表示したいコメントが入力可能になります。</li>
							<li>任意で範囲指定を選択してください。</li>
							<li>表示したいコメントを入力してください。</li>
							<li>行テキストに表示された内容が、ゲーム内で発言するべき内容となります。</li>
						</ul>
					</td>
				</tr>
				
			</table>
			
			<br />
			
			<h3>連絡先</h3>
			<div>不具合報告、フィードバック等は<a target="_blank" href="http://fesns.com/?m=pc&amp;a=page_f_home&amp;target_c_member_id=302172">こちら</a>にてお願いします。</div>
			
			<br />
			
			<h3>更新履歴</h3>
			<ul class="std_msg">
				<li>2012/05/19 見た目の調節</li>
				<li>2012/05/18 使い方・更新履歴の追加</li>
				<li>2012/05/17 クロスブラウザ対応　表示部の固定ピッチ化　IEだけ最初の改行コードを2重化</li>
				<li>2012/05/15 初版作成</li>
			</ul>
		</div>
	</div>
	

</form>